<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      function getCurrentLocation() {
        if (navigator.geolocation) {
          // 获取当前位置
          navigator.geolocation.getCurrentPosition(success, error);

          // 持续定位
          let id = navigator.geolocation.watchPosition(success, error);

          // 10s 后清除监听定位
          setTimeout(() => {
            navigator.geolocation.clearWatch(id);
          }, 10e3);
        } else {
          console.log("浏览器不支持定位功能");
        }
      }

      function success(position) {
        const { coords, timestamp } = position;
        console.log("时间", new Date(timestamp).toLocaleString());
        console.log("定位信息", coords);
        console.log("------ 纬度：", coords.latitude);
        console.log("------ 经度：", coords.longitude);
      }

      function error(error) {
        switch (error.code) {
          case error.PERMISSION_DENIED:
            x.innerHTML = "User denied the request for Geolocation.";
            break;
          case error.POSITION_UNAVAILABLE:
            x.innerHTML = "Location information is unavailable.";
            break;
          case error.TIMEOUT:
            x.innerHTML = "The request to get user location timed out.";
            break;
          case error.UNKNOWN_ERROR:
            x.innerHTML = "An unknown error occurred.";
            break;
        }
      }

      getCurrentLocation();
    </script>
  </body>
</html>
